﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Web Camera</title>
	<link rel="stylesheet" href="jquery/css/jquery.ui.all.css" />
	<link rel="stylesheet" href="css/common.css" />
	<script src="jquery/jquery-1.9.1.min.js"></script>
	<script src="jquery/jquery.ui.core.js"></script>
	<script src="jquery/jquery.ui.widget.js"></script>
	<script src="jquery/jquery.ui.mouse.js"></script>
	<script src="jquery/jquery.ui.slider.js"></script>
	<script src="jquery/json2.js"></script>
	<script src="js/network.js"></script>
	<script src="js/common.js"></script>
	<script src="js/qrcode.js"></script>
</head>

<style type="text/css">
.P2pDiv{
	background:#1c1d22;
	left:0px;
	right:0px;
	height:270px;
}

.DivLable{
	text-align:left;
	line-height: 23px;
	font-family:arial;
	font-style:regular;
	font-size:16px;
	color:#ffffff;
	height:23px;
	cursor: pointer;
}


.DivInputAtLoacalRecord{
	width:280px;
	float:left;
}

#id_txtLocalrecordpath{
	width:160px;
	float:left;
}


.txtUUID{
	width:60px;
	float:left;
	margin-top:60px;
}



</style> 
<script  type="text/javascript"> 
//语言包初始化
document.write(GetLanguagePathStr());
</script>

<body>   
<div class="P2pDiv"  style="min-width:600px;">
	<div style="height:100%;margin:auto;width:600px;">
		<div style="clear:both;height:15px;"></div>
		<div class="DivCheckBox" style="float:left;"id="id_P2p"><script>InitCheckBox('id_P2p','true')</script></div>
		<div class="DivLable" style="float:left;margin-left:10px;" id="id_txtP2p">P2P</div>
		<div style="clear:both;height:15px;"></div>	
		
		<div class="DivLable txtUUID" id="id_txtUUID">UUID:</div>
		<div id="ID_Qrcode" style="width:150px;height:150px; float:left;margin-left:10px;"></div>
		<div class="DivLable txtUUID" id="id_txtUUID" style="float:left;margin-left:100px;">APP:</div>
		<div id="ID_App" style="width:150px;height:150px;float:left;margin-left:10px;"></div>
		
		<div style="clear:both;height:15px;"></div>
		<div class="DivButton" style="float:left;margin-left:260px;" id="id_submit">Save</div>
		<div style="clear:both"></div>
	</div>
</div>
</body> 
<script  type="text/javascript"> 
//语言包初始化
function InitLang(){
	SetLang('id_submit',str_btnSnapSave);
};
</script> 

<script  type="text/javascript"> 
function InitPageParam()
{
	var resp = $.sendMsg("P2PStatus",null,"/ISAPI/Network/P2P","POST");
	if(resp.success == false){
		alert("recv SNMPStatus  msg fail");
		return;
	}

	var map = resp.data;
	console.log( JSON.stringify(map));
	SetCheckBox('id_P2p',TranslationStrAndBool(map.enabled));
	if(map.p2puuid != null)
		initQrccode(map.p2puuid);
}

function submit()
{
	var str_idP2p;
	if(GetCheckBoxValue('id_P2p') == "false"){
		str_idP2p = "0";
	}else{
		str_idP2p = "1";
	}
	var msg = [
				{"xtype":"enabled","text":str_idP2p}
			];
	
	var resp = $.sendMsg("P2PStatus",msg,"/ISAPI/Network/P2P","PUT");
	console.log(JSON.stringify(msg));
	if(resp.success == false){
		alert("submit submit msg fail");
	}else{
		alert(str_SetSuccess);
	}
	
}
function initQrccode(uuid)
{
	var qrcObj = document.getElementById("ID_Qrcode");
	var qrcode = new QRCode(qrcObj, {
		width : 150,
		height : 150,
	});
	qrcode.makeCode(uuid);
}

function initApp(app)
{
	var qrcObj = document.getElementById("ID_App");
	var qrcode = new QRCode(qrcObj, {
		width : 150,
		height : 150,
	});
	qrcode.makeCode(app);
}

$(function(){
	InitLang();
	InitPageParam();	
	BindEvent('id_submit','onmousedown',submit,null);
	initApp("http://a.app.qq.com/o/simple.jsp?pkgname=com.zcloud.p2pviewcam");
});
</script> 
  
</html>  